<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name = "renderer" content = "webkit" >
<meta name="viewport" content="initial-scale=1,maximum-scale=1.0,user-scalable=no">
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<script src="js/3rd/jquery.js"></script>
<script src="js/3rd/base.js"></script>
<script src="js/3rd/vue/vue.js"></script>
<title>首页</title>
</head>

<body>

	<div class="container" id="vue-star" v-bind:style="{ 'background-image': getBg() }">
    	
        <template v-for="(item ,index) in starMaxNum">
        	<img v-bind:src="getStar()" width="50" class="fadeIn a-yjfx star" :class="[getAniTime(),getDelayTime()]" :style="getStarPosition(index)">
        </template>
        
        <template v-for="(item, index) in peishiMaxNum">
        	<img v-bind:src="getPeishi()" width="50" :style="getPeishiPosition(index)">
        </template>
        
        <p class="align_center wrap-btn">
	        <a href="javascript:" class="btn js-shouwBtn" v-on:click="showRwsult()">查看有几个星星</a>
        </p>
        
        <div class="num-wrap hide">
            <p class="wOne">总共有<span class="num">{{starMaxNum}}</span>颗星星</p>
            <p>你猜对了吗</p>
            <p>
            	<a href="javascript:" class="btn btn-blue" v-on:click="angin()">再来猜一次</a>
                <a href="javascript:" class="btn btn-yellow" v-on:click="hideResult()">不玩了</a>
			</p>
        </div>
    </div>
    
    <script src="js/index.js"></script>
</body>
</html>